<template>
	<view class="uform">
		<u--form labelPosition="left" labelWidth="100" ref="form1">
			<typeSelector @getdata="gettype" :list="columns">
				<u-form-item label="卡券类型" borderBottom ref="item1">
					<u--input class="inputx" disabledColor="#ffffff" placeholder="请选择卡券类型" disabled v-model="type"
						inputAlign="right" border="none"></u--input>
					<!-- <u-icon name="arrow-right"></u-icon> -->
					<u-icon slot="right" name="arrow-right"></u-icon>
				</u-form-item>
			</typeSelector>
			<citySelection @getdata="getRegion">
				<u-form-item label="城市选择" borderBottom ref="item1">
					<u--input class="inputx" disabledColor="#ffffff" placeholder="请选择城市" disabled v-model="region"
						inputAlign="right" border="none"></u--input>
					<u-icon slot="right" name="arrow-right"></u-icon>
				</u-form-item>
			</citySelection>
		</u--form>
	</view>
</template>

<script>
	import typeSelector from '@/components/typeSelector/typeSelector.vue'
	import citySelection from '@/components/citySelection/citySelection.vue'
	export default {
		components: {
			typeSelector,
			citySelection
		},
		data() {
			return {
				type: '',
				columns: [
					['类型一', '类型二', '类型三']
				],
				region: '',
			};
		},
		methods: {
			gettype(e) {
				this.type = e.value[0]
			},
			// 修改地区
			getRegion(e) {
				// 过滤数组中的空值
				var r = e.data.filter(function(s) {
					return s && s.trim(); // 注：IE9(不包含IE9)以下的版本没有trim()方法
				});
				this.region = r.join(",")
				// var data = {
				// 	region: this.data.region,
				// 	id: this.id
				// }
				// this.userEdit(data)
			},
		}
	};
</script>
<style scoped lang="scss">
	.uform {
		width: 690rpx;
		margin: 0 auto;
	}
</style>
